﻿// Collapser reacts to browser events to show or hide target component(s)
define([
    'Wjs/ui/widgets/tools/Tool'
],
function (Tool) {
    'use strict';

    var type = 'collapser',
    typeManager = Wjs.typeManager,
    Collapser = typeManager.getType(type);

    if (Collapser) { // It has been already loaded
        return Collapser;
    }

    Collapser = Wjs.typeBuilder.define({
        base: Tool,
        construct: function (conf, parent) {
            var me = this;
            conf = conf || {};

            Collapser.base.constructor.call(me, conf, parent);

            me.collapsed = conf.collapsed; // Initially collapsed
            me.collapsedClass = conf.collapsedClass || 'w-collapsed';
            me.expandedClass = conf.expandedClass || 'w-expanded';

            me.addClass(conf['class'] || 'w-collapser');

            me.addClass(me.collapsed ? me.collapsedClass : me.expandedClass);

            me.targets = conf.targets || [];

            // Add the event handlers
            me.onBeforeCollapse = conf.onBeforeCollapse;
            me.onCollapse = conf.onCollapse;

            me.onBeforeExpand = conf.onBeforeExpand;
            me.onExpand = conf.onExpand;

            me.clickHandler = Wjs.chain(conf.clickHandler,
                function () {
                    me.toggle();
                },
                me);

            me.renderHandler = Wjs.chain(me.renderHandler, function () {
                if (me.collapsed) { // Hide the targets if initially collapsed
                    me.hideTargets();
                }
            }, me);
        },

        type: type,

        // Shows this control in a collapsed way and hides the target components of this collapser
        collapse: function () {
            var me = this;

            if (!me.collapsed) {

                if (me.onBeforeCollapse) {
                    if (me.onBeforeCollapse.call(me) === false) {
                        return; // Cancel collapsing
                    }
                }

                me.collapsed = true;

                me.updateClass();
                me.hideTargets();

                if (me.onCollapse) {
                    me.onCollapse.call(me);
                }
            }
        },

        // Shows this widget in a expanded way and shows the target components of this collapser
        expand: function () {
            var me = this;

            if (me.collapsed) {

                me.collapsed = false;

                if (me.onBeforeExpand) {
                    if (me.onBeforeExpand.call(me) === false) {
                        return; // Cancel expanding
                    }
                }

                me.updateClass();
                me.showTargets();

                if (me.onExpand) {
                    me.onExpand.call(me);
                }
            }
        },

        showTargets: function () {
            var me = this;

            if (!me.targets) {
                console.log('No targets to show');
                return;
            }

            me.targets.forEach(function (c) {
                c.show();
            });
        },

        hideTargets: function () {
            var me = this;

            if (!me.targets) {
                console.log('No targets to hide');
                return;
            }

            me.targets.forEach(function (c) {
                c.hide();
            });
        },

        updateClass: function () {
            var me = this;

            if (me.collapsed) {
                me.replaceClass(me.expandedClass, me.collapsedClass);
            }
            else {
                me.replaceClass(me.collapsedClass, me.expandedClass);
            }
        },

        // If it is collapsed the expand it, collapse it otherwise
        toggle: function () {
            var me = this;

            if (me.collapsed) {
                me.expand();
            }
            else {
                me.collapse();
            }
        }
    });

    typeManager.registerType(Collapser);

    return Collapser;
});